<template>
  <div class="applyItem-box" @click="$router.push({path: '/applyDetail', query: {id: detail.id}})">
    <div class="applyItem-container">
      <!-- 售后信息 -->
      <van-cell class="apply-info" :border="false">
        <div slot="title" class="apply-num">服务编号：{{detail.returnSn}}</div>
        <div slot="extra" class="apply-status">{{detail.showReturnType + ' - ' + detail.showReturnStatus}}</div>
      </van-cell>
      <!-- 商品信息 -->
      <div class="order-goods-list">
        <div class="order-goods-item" v-for="(applyItem, index) in detail.returnApplyItemList" :key="index">
          <van-image :src="applyItem.goodsPic" />
          <div class="goods">
            <span class="title van-multi-ellipsis--l2">{{applyItem.goodsName}}</span>
            <span class="num">x{{applyItem.goodsNum}}</span>
            <span class="price">¥{{applyItem.goodsPrice | fentoyuan}}</span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'applyDetail',
  props: ['detail'],
  data () {
    return {

    }
  },
  methods: {
  }
}
</script>

<style lang="scss">
.applyItem-container{
  background: #fff;
  margin: 5px 10px;
  margin-bottom: 10px;
  padding: 10px 10px;
  border-radius: 5px;
  .apply-info{
    padding-left: 0;
    padding-right: 0;
    border-bottom: 1px solid #f2f2f2;
    .apply-num{
      color: #333;
      font-size: 13px;
    }
    .apply-status{
      color: #a8700d;
      font-size: 13px;
    }
  }
}
</style>
